<template>
	<page-body>
		<view class="page">
			<view class="flex benben-position-layout flex flex-wrap align-center sjtp_flex_0_higd"
				:style="{height:(88+StatusBarRpx)+'rpx',paddingTop:StatusBarRpx+'rpx', }">
				<view class='flex flex-wrap align-center justify-between flex-sub sjtp_fd0_0_higd'>
					<view class='flex flex-wrap align-center sjtp_fd0_0_c0_higd' >

					</view>
					<view class='flex flex-wrap align-stretch justify-center'>
						<text class='sjtp_fd0_0_c1_c0_higd'>数据图墙</text>
					</view>
					<view class='flex flex-wrap align-center justify-end sjtp_fd0_0_c0_higd'>
					</view>
				</view>

			</view>
			<view :style="{height: (88+StatusBarRpx)+'rpx'}"></view>
			<!---flex布局flex布局开始-->
			<!-- @tap.stop="dynamicJump(`https://yufabu.saizhuge.net/spread/general/without_login?view_name=shujudaping_mobile_adapter&member_id=4037`)" -->
			<view class="flex flex-wrap align-center justify-between benben-flex-layout sjtp_flex_1_higd">
				
				<view class='flex flex-wrap align-center sjtp_fd1_0_higd2' v-for="(item,index) in listdata" :key='index' @tap.stop="jumpurl(item.url)">
					<image class='sjtp_fd1_0_c0_higd2' mode="aspectFit" :src='item.icon'></image>
					<view class='flex flex-direction align-stretch sjtp_fd1_0_c1_higd2'>
						<text>{{item.name}}</text>
					</view>
					<image class='all' mode="aspectFit" :src='STATIC_URL+"11.png"'></image>
				</view>
				<view class='flex flex-wrap align-center sjtp_fd1_0_higd2' @tap.stop="jumpbg(1)" v-if="roles == 489">
					<image class='sjtp_fd1_0_c0_higd2' mode="aspectFit" :src='STATIC_URL+"126.png"'></image>
					<view class='flex flex-direction align-stretch sjtp_fd1_0_c1_higd2'>
						<text>年级平均成绩</text>
					</view>
					<image class='all' mode="aspectFit" :src='STATIC_URL+"11.png"'></image>
				</view>
				<view class='flex flex-wrap align-center sjtp_fd1_0_higd2' @tap.stop="jumpbg(2)"v-if="roles == 489">
					<image class='sjtp_fd1_0_c0_higd2' mode="aspectFit" :src='STATIC_URL+"126.png"'></image>
					<view class='flex flex-direction align-stretch sjtp_fd1_0_c1_higd2'>
						<text>班级学习进度</text>
					</view>
					<image class='all' mode="aspectFit" :src='STATIC_URL+"11.png"'></image>
				</view>
				<view class='flex flex-wrap align-center sjtp_fd1_0_higd2'@tap.stop="jumpbg(3)" v-if="roles == 489">
					<image class='sjtp_fd1_0_c0_higd2' mode="aspectFit" :src='STATIC_URL+"126.png"'></image>
					<view class='flex flex-direction align-stretch sjtp_fd1_0_c1_higd2'>
						<text>班级平均成绩</text>
					</view>
					<image class='all' mode="aspectFit" :src='STATIC_URL+"11.png"'></image>
				</view>
				<view class='flex flex-wrap align-center sjtp_fd1_0_higd2' @tap.stop="jumpbg(4)" v-if="roles == -1">
					<image class='sjtp_fd1_0_c0_higd2' mode="aspectFit" :src='STATIC_URL+"126.png"'></image>
					<view class='flex flex-direction align-stretch sjtp_fd1_0_c1_higd2'>
						<text>个人成绩</text>
					</view>
					<image class='all' mode="aspectFit" :src='STATIC_URL+"11.png"'></image>
				</view>
				
			</view>


		</view>
	</page-body>
</template>
<script src="https://cdnjs.cloudflare.com/ajax/libs/blueimp-md5/2.19.0/js/md5.min.js"></script>
<script>
		import CryptoJS from 'crypto-js';
		import { host } from '@/common/config.js';
	function md5Encrypt(message) {
		return CryptoJS.MD5(message).toString();
	}
	export default {
		components: {},


		data() {
			return {
				listdata:[],
				roles: '', //0 或者 1是管理员超管，教职工的是489，保安员是491
				group: '', //1学生 2教师
				
			};
		},
		computed: {

		},
		watch: {},
		onLoad(options) {

		},
		onUnload() {

		},
		onReady() {

		},
		onShow() {
			console.log(uni.getStorageSync('USER_INFO_7863'))
			this.group = uni.getStorageSync('USER_GROUP')
			this.roles = uni.getStorageSync('USER_ROLES') ? uni.getStorageSync('USER_ROLES') : '-1'
			console.log(uni.getStorageSync('USER_ROLES'))
			console.log(this.roles)
			this.getlist()
		},
		onHide() {

		},
		onResize() {

		},
		onPullDownRefresh() {

		},
		onReachBottom(e) {

		},
		onPageScroll(e) {

		},
		methods: {
			jumps(type) {
				uni.navigateTo({
					url: '/pagetabBar/sjtp/daping?type=' + type
				})
			},
			async jumpurl(url){
				let encryptedMessage = md5Encrypt('123456a'); // 要加密的信息
				let urls=host+'/api/v1/5c78dbfd977cf'
				let datadataList = await this.$api.post(urls, {
					mobile: '15166662222',
					member_id: '4037',
					account_type: 'mobile',
					password: encryptedMessage
				});
				let token = datadataList.data.data.userinfo.user_token;
				console.log(token)
				uni.hideLoading()
				uni.setStorageSync('DP_url',url+'?token='+token)
				
				uni.navigateTo({
					url: '/pagetabBar/sjtp/daping'
				})
			},
			async getlist(){
				let roles=this.roles==(0||1)?1:this.roles==491?2:this.roles==489?3:4
				let list = await this.$api.get(global.apiUrls.post6874aae67d8ca, {
					open_role:roles,
				});
				
				if (list.data.code != 1) {
				    this.$message.info(list.data.msg);
				    return
				}
				let infouserInfo = list.data;
				console.log(this.roles)
				
					console.log(roles)
				this.listdata = infouserInfo.data
				console.log(this.listdata)
			},
			jumpbg(type){
				uni.navigateTo({
					url:'/pagetabBar/sjtp/cjd/cjd?type=' + type
				})
				return
				uni.navigateTo({
					url:'/pagetabBar/sjtp/cjd/bg?type=' + type
				})
			},
			jump(type) {
				if (type == 1) {
					uni.setStorageSync('url',
						'https://yufabu.saizhuge.net/spread/general/without_login?view_name=aizhihuixiaofangjiashicang_mobile_adapter&member_id=4037'
						)

				} else {

				}
				uni.navigateTo({
					url: '/pages/sjtq/homepage/homepage?type=' + type
				})
			}
		}
	};
</script>
<style lang="scss" scoped>
	.page {
		width: 100vw;
		overflow-x: hidden;
		min-height: calc(100vh - var(--window-bottom));
		background: rgba(255, 255, 255, 1);
		background-size: 100% auto;

		.sjtp_flex_1_higd {
			margin: 0 32rpx;
		}

		.sjtp_fd1_0_higd {
			background: #FFFFFF;
			width: 331rpx;
			height: 172rpx;
			box-shadow: 0rpx 3rpx 16rpx 1rpx rgba(0, 0, 0, 0.1);
			margin: 0rpx 0rpx 024rpx 0rpx;
			border-radius: 16rpx;
			flex-wrap: nowrap;
		}
		.sjtp_fd1_0_higd2{
			width: 100%;
			background: #FFFFFF;
			height: 137rpx;
			// box-shadow: 0rpx 3rpx 16rpx 1rpx rgba(0, 0, 0, 0.1);
			// padding: 32rpx;
			// margin: 0rpx 0rpx 024rpx 0rpx;
			// border-radius: 16rpx;
			flex-wrap: nowrap;
			// padding: 0 32rpx;
			border-bottom:  1rpx solid #eee;
		}

		.sjtp_fd1_0_c0_higd {
			width: 92rpx;
			height: 92rpx;
			border-radius: 0rpx;
			margin: 0rpx 24rpx 0rpx 32rpx;
		}
		.sjtp_fd1_0_c0_higd2{
			width: 72rpx;
			height: 92rpx;
			border-radius: 0rpx;
			margin: 0rpx 24rpx 0rpx 0;
		}

		.sjtp_fd1_0_c1_higd {
			color: #333;
			font-size: 36rpx;
			font-weight: 500;
			width: 152rpx;
		}
		.sjtp_fd1_0_c1_higd2{
			color: #333;
			font-size: 36rpx;
			font-weight: 500;
		}
		.all{
			width: 12rpx;
			height: 22rpx;
			margin-left: auto;
		}

		.sjtp_flex_0_higd {
			width: 750rpx;
			height: 88rpx;
			overflow: hidden;
			z-index: 10;
			top: 0rpx;
			background: #fff;
			background-size: 100% auto !important;

			.sjtp_fd0_0_higd {
				padding: 0rpx 32rpx 0rpx 32rpx;

				.sjtp_fd0_0_c1_c0_higd {
					font-size: 36rpx;
					font-weight: 700;
					color: #333333;
					line-height: 50rpx;
				}
			}
		}

		.sjtp_fd0_0_c0_higd {
			width: 120rpx;

			.sjtp_fd0_0_c0_c0_higd {
				font-size: 36rpx;
				color: #333;
			}
		}
	}

	.notq {
		width: 100%;
		margin-top: 230rpx;
		text-align: center;
	}
</style>
